<template>
	<view>
		<view class="pad-lr-30 pad-tb-20">
			<view class="fontSize-30 mar-bottom-20">机具绑定测试</view>
			
			<view class="bgfff radius-16 pad-lr-30 pad-tb-30">
				<view class="form-item mar-bottom-20">
					<text class="fontSize-28 mar-bottom-10">机身号</text>
					<input v-model="possn" placeholder="请输入机身号" class="input" />
				</view>
				
				<button @click="bindMachine" class="btn" :disabled="loading">
					{{ loading ? '绑定中...' : '绑定机具' }}
				</button>
			</view>
			
			<view class="bgfff radius-16 pad-lr-30 pad-tb-30 mar-top-20" v-if="result">
				<text class="fontSize-28">结果：</text>
				<text class="fontSize-24 col-6 mar-top-10">{{ result }}</text>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { post } from '@/utils/http'
import { ApitestUrl } from '@/utils/api'

const possn = ref('')
const result = ref('')
const loading = ref(false)

const bindMachine = async () => {
	if (!possn.value.trim()) {
		uni.showToast({
			title: '请输入机身号',
			icon: 'none'
		})
		return
	}
	
	loading.value = true
	result.value = ''
	
	try {
		const response = await post(ApitestUrl + '/api/LishuaCallback/bindMachine', {
			possn: possn.value.trim()
		})
		
		result.value = JSON.stringify(response, null, 2)
		
		if (response.code === 1) {
			uni.showToast({
				title: '绑定成功',
				icon: 'success'
			})
		} else {
			uni.showToast({
				title: response.msg || '绑定失败',
				icon: 'none'
			})
		}
	} catch (error) {
		console.error('绑定失败:', error)
		result.value = '错误: ' + error.message
		uni.showToast({
			title: '绑定失败，请重试',
			icon: 'none'
		})
	} finally {
		loading.value = false
	}
}
</script>

<style lang="scss" scoped>
.form-item {
	.input {
		width: 100%;
		height: 80rpx;
		border: 2rpx solid #e0e0e0;
		border-radius: 8rpx;
		padding: 0 20rpx;
		font-size: 28rpx;
		box-sizing: border-box;
	}
}

.btn {
	width: 100%;
	height: 80rpx;
	background: #007aff;
	color: white;
	border: none;
	border-radius: 8rpx;
	font-size: 28rpx;
	
	&:disabled {
		background: #ccc;
		color: #999;
	}
}
</style>
